<template>
	<view>
		<!-- 顶部导航栏 -->
		<!-- <view v-if="showHeader" class="header" :style="{ position: headerPosition, top: headerTop, opacity: afterHeaderOpacity }"> -->
		<!-- 搜索框 -->
		
		<hx-Navbar :back="false" :fixed="true" :leftSlot="false">
			<!-- <block slot="left"> -->
			<view class="nav_title" style="margin-left: 4%; margin-right: 30rpx;">首页</view>
			<view class="input-box">
				<input placeholder="搜索" disabled placeholder-style="color:#c0c0c0;" @tap="toSearch()" />
				<view class="icon search"></view>
			</view>
			<!-- 右侧图标按钮 -->
			<!-- </block> -->
		</hx-Navbar>
		<!-- </view> -->
		<!-- 占位 -->
		<!-- <view v-if="showHeader" class="place"></view> -->
		<!-- 定位城市 -->
		<view class="addr">
			<view class="icon location" @tap="jumpPosition"></view>
			<text @tap="jumpPosition" class="city_name">{{ city }}</text>
			<view class="master" v-if="!master.user_name" @tap="jumpMaster">请选择网格长</view>
			<view class="master" v-else @tap="jumpMaster">
				<image :src="master.head_img" mode=""></image>
				<text>{{ master.user_name }}</text>
			</view>
		</view>
		
		<!-- 轮播图 -->
		<view class="swiper">
			<view class="swiper-box">
				<swiper circular="true" autoplay="true" @change="swiperChange">
					<swiper-item v-for="(swiper, index) in swiperList" :key="index"><image :src="swiper.img" @tap="toSwiper(swiper)"></image></swiper-item>
				</swiper>
				<view class="indicator">
					<view
						class="dots"
						v-for="(swiper, index) in swiperList"
						:class="[currentSwiper >= index ? 'on' : '']"
						:key="index"
						:style="{ width: currentSwiper >= index ? 100 / swiperList.length + '%' : '' }"
					></view>
				</view>
			</view>
		</view>
		<!-- 分类列表 -->
		<view class="category-list">
			<view class="category" v-for="(row, index) in categoryList" :key="index" @tap="toCategory(row)">
				<view class="img"><image :src="row.icon" mode="aspectFit"></image></view>
				<view class="text">{{ row.title }}</view>
			</view>
		</view>
		<!-- 活动区 -->
		<activity :colors="newcolors" :dataList="GroupList" :times="times" v-if="GroupList.length !== 0"></activity>
		<!-- <view class="promotion">
			<view class="text">优惠专区</view>
			<view class="list">
				<view class="column" v-for="(row, index) in Promotion" @tap="toPromotion(row)" :key="index">
					<view class="top">
						<view class="title">{{ row.title }}</view>
						<view class="countdown" v-if="row.countdown">
							<view>{{ row.countdown.h }}</view>
							:
							<view>{{ row.countdown.m }}</view>
							:
							<view>{{ row.countdown.s }}</view>
						</view>
					</view>
					<view class="left">
						<view class="ad">{{ row.ad }}</view>
						<view class="into">点击进入</view>
					</view>
					<view class="right"><image :src="row.img"></image></view>
				</view>
			</view>
		</view> -->
		<!-- 广告图 -->
		<view class="banner" v-if="activityData[0].img && activityData[0].img !== ''"><image :src="activityData[0].img" @tap="jumpXianshi"></image></view>
		<!-- 商品列表 -->
		<view id="seckill" style="overflow: hidden;" v-if="seckList.length !== 0">
			<Seckill :colors="newcolors" :dataList="dataList" :heights="heights" :dates="dates" :scrollY="isScroll" :hours="hours" :goodsData="seckList" @getSeckllGoods="getSeckllGoods"></Seckill>
		</view>
		<!-- <view class="goods-list">
			<view class="title">
				<image src="/static/img/hua.png"></image>
				猜你喜欢
				<image src="/static/img/hua.png"></image>
			</view>
			<view class="product-list">
				<view class="product" v-for="product in productList" :key="product.goods_id" @tap="toGoods(product)">
					<image mode="widthFix" :src="product.img"></image>
					<view class="name">{{ product.name }}</view>
					<view class="info">
						<view class="price">{{ product.price }}</view>
						<view class="slogan">{{ product.slogan }}</view>
					</view>
				</view>
			</view>
			<view class="loading-text">{{ loadingText }}</view>
		</view> -->
		<!-- <view class="fixed_btn" :style="{ background: newcolors.color }" @click="jumpPoster">
			<image src="../../../static/img/fenxiang.png" mode=""></image>
			<text>分享</text>
		</view> -->
	</view>
</template>

<script>
import hxNavbar from '../../../components/hx-navbar/hx-navbar.vue';
import activity from '@/components/activity/activity.vue';
import Seckill from '@/components/activity/Seckill.vue';
import { setRecommend, setCateId, getColorCofig, getMaster, getlocation, setUserInfo, removeToken } from '../../../static/utils/ahth.js';
import qqmapsdk from '../../../static/utils/qqmap-wx-jssdk.min.js';
var statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
export default {
	components: {
		hxNavbar,
		activity,
		Seckill
	},
	data() {
		return {
			newcolors: {},
			statusBarHeight: statusBarHeight,
			master: {},
			showHeader: true,
			afterHeaderOpacity: 1, //不透明度
			headerPosition: 'fixed',
			headerTop: null,
			statusTop: null,
			nVueTitle: null,
			city: '北京',
			currentSwiper: 0,
			// 轮播图片
			swiperList: [],
			// 分类菜单
			categoryList: [],
			Promotion: [],
			//猜你喜欢列表
			productList: [],
			loadingText: '正在加载...',
			seckList: [],
			GroupList: [],
			times: '',
			location: {},
			activityData: {},
			userInfo: {},
			hours: 0,
			ceshi: [],
			isScroll: false,
			pages: 1,
			scrollTop: 0,
			heights: 0,
			dates:'',
			dataList:[],
			seckillId:''
		};
	},
	onReachBottom: function() {
		// pullScroll.success();
		console.log('上拉加载');
		let that = this;
		setTimeout(() => {
			that.pages++;
			that.request('goods/getSeckillGoodsList', {
				page: that.pages,
				psize: 10,
				seckill_id: that.seckillId,
			}).then(res => {
				if(res.code == 200){
					if(res.data.length !== 0){
						let data = res.data
						that.dataList = that.dataList.concat(data)
					}
				}
				let dates = new Date().getTime();
				that.dates = dates + 10
				let date = new Date();
				let hours = date.getHours();
				that.hours = hours;
			});
		});
	},
	onShow() {
		this.pageIndex = 1
		uni.showTabBar();
		this.getUserInfo();
		this.newcolors = getColorCofig();
		this.getBanner();
		this.getClass();
		this.getGoodList();
		setCateId(0);
		let date = new Date();
		this.dates = date
	},
	onPageScroll(e) {
		//兼容iOS端下拉时顶部漂移
		this.headerPosition = e.scrollTop >= 0 ? 'fixed' : 'absolute';
		this.headerTop = e.scrollTop >= 0 ? null : 0;
		this.statusTop = e.scrollTop >= 0 ? null : -this.statusHeight + 'px';
		if (e.scrollTop >= this.scrollTop && this.seckList.length !== 0) {
			// console.log(e)
			this.isScroll = true;
		} else {
			this.isScroll = false;
		}
	},
	onLoad(option) {
		// 获取地址
		console.log('用户信息', option);
		this.getUserPosition();
		//获取推荐码
		// #ifdef MP-WEIXIN
		if (option && option.pid !== undefined) {
			let recommend = option.pid || '';
			if (recommend !== '') {
				setRecommend(recommend);
			}
			console.log('这是用户的推荐码', option.pid);
		}
		// #endif
		// #ifdef H5
		this.setRecommends();
		// #endif
		this.ongetGroupList();
		this.getSeckillList();
	},
	methods: {
		//搜索跳转
		toSearch() {
			this.$Router.push({
				path: '/pagesA/pages/home/search'
			});
		},
		getSeckllGoods(item){
			this.pages = 1
			this.seckillId = item.seckill_id
			this.request('goods/getSeckillGoodsList',{
				seckill_id: item.seckill_id,
				page: this.pages,
				psize: 10
			}).then(res=>{
				this.dataList = res.data
				let dates = new Date().getTime();
				this.dates = dates + 10
			})
		},
		//轮播图跳转
		toSwiper(e) {
			console.log(e);
				if (e.type == 1) {
					//内部链接
					this.$Router.push({
						path: '/pagesA/pages/goods/goodsDetails',
						query: {
							goodid: e.link_url
						}
					});
				} else if (e.type == 2) {
					//外部链接
					this.$Router.push({
						path: '/pagesA/pages/user/links',
						query: {
							url: e.link_url
						}
					});
				} else if (e.type == 3) {
					this.$Router.push({
						path: e.link_url
					});
				}
			// uni.showToast({ title: e.link_url, icon: 'none' });
		},
		//分类跳转
		toCategory(row) {
			console.log(row);
			setCateId(row.id);
			this.$Router.pushTab({
				path: '/pages/tabBar/category/category'
			});
		},
		//推荐商品跳转
		toPromotion(e) {
			uni.showToast({ title: e.title, icon: 'none' });
		},
		//商品跳转
		toGoods(e) {
			uni.showToast({ title: '商品' + e.goods_id, icon: 'none' });
			this.$Router.push({
				path: '/pages/goods/goods'
			});
		},
		// 限时秒杀
		jumpXianshi() {
			this.$Router.push({
				path: '/pagesA/pages/home/limitedTime'
			});
		},
		//轮播图指示器
		swiperChange(event) {
			this.currentSwiper = event.detail.current;
		},
		setRecommends() {
			//截取用户分享后的推荐码
			let name = 'pid';
			var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
			let herf = window.location.href;
			let url = herf.split('#')[0];
			let search = url.split('?')[1];
			if (search) {
				var r = search.substr(0).match(reg);
				if (r !== null) {
					this.recommend = unescape(r[2]);
					setRecommend(this.recommend);
				} else {
					return null;
				}
			} else {
				return null;
			}
		},
		jumpPosition() {
			//跳转到选择地址
			this.$Router.push({ path: '/pages/home/setlocation' });
		},
		jumpMaster() {
			this.$Router.push({ path: '/pages/home/setMaster' });
		},
		getUserPosition() {
			/**
			 * 在这里执行获取用户的位置
			 */
			//获取用户位置
			let that = this;
			const QQMapWX = new qqmapsdk({
				//腾讯地图  需要用户自己去申请key
				// key: '7JFBZ-V2EH4-3CCU2-DL5N2-DZQL7-RTBOJ' //好样key
				key: 'R46BZ-RCEC5-FB7I6-QEYJ4-WO3H2-XKFKN' //社区团购key
				// key:'W5GBZ-LEVWX-VQ34M-TGDSN-VDAHQ-S7FPJ'  //伊亚塔西餐厅key
			});
			var latitude = '';
			var longitude = '';
			uni.getLocation({
				type: 'wgs84',
				geocode: true,
				success: res => {
					console.log('获取经纬度成功');
					latitude = res.latitude;
					longitude = res.longitude;
				},
				fail: () => {
					console.log('获取经纬度失败');
				},
				complete: () => {
					// 解析地址
					QQMapWX.reverseGeocoder({
						location: {
							latitude: latitude,
							longitude: longitude
						},
						success: function(res) {
							console.log('解析地址成功');
							console.log(res);
							// 省
							let province = res.result.ad_info.province;
							// 市
							let city = res.result.ad_info.city;
							console.log(province);
							console.log(city);
							// setMyposition(city);
							if (that.location.address && that.location.address !== '') {
								that.city = that.location.address;
							} else {
								that.city = city;
							}
							// that.getExhibition();
							console.log('这是地址', that.city);
						},
						fail: function(res) {
							uni.showToast({
								title: '定位失败',
								duration: 2000,
								icon: 'none'
							});
							console.log(res);
						},
						complete: function(res) {
							console.log(res);
						}
					});
				}
			});
		},
		getBanner() {
			//获取轮播图
			this.request('common/getBannerList', {
				address: 1
			}).then(res => {
				console.log(res);
				this.swiperList = res.data;
			});
		},
		getClass() {
			//获取栏目列表
			this.request('common/getCategoryList', {}).then(res => {
				console.log(res,77);
				if (res.code == 200) {
					
					this.categoryList = res.data;
				}
			});
		},
		getSeckillList() {
			//获取商品秒杀列表
			this.request('goods/getSeckillList', {
				page: this.pages,
				psize: 10
			}).then(res => {
				this.seckList = res.data;
				console.log(this.seckList);
				this.getSeckllGoods(res.data[0])
				let date = new Date();
				this.dates = date
				let hours = date.getHours();
				this.hours = hours;
				let that = this;
				setTimeout(() => {
					uni.getSystemInfo({
						success: function(res) {
							that.heights = res.screenHeight;
							console.log(that.heights);
						}
					});
					const query = uni.createSelectorQuery().in(that);
					query
						.select('#seckill')
						.boundingClientRect(data => {
							console.log('得到布局位置信息' + JSON.stringify(data));
							console.log('节点离页面顶部的距离为' + data.top);
							that.scrollTop = data.top - 80;
						})
						.exec();
				}, 500);
			});
		},
		ongetGroupList() {
			//获取拼团列表
			this.request('goods/getGroupList', {}).then(res => {
				console.log(res);
				this.GroupList = res.data[0].group_goods;
				this.setTime(res.data);
			});
		},
		getGoodList() {
			//获取活动专区
			this.request('goods/getActivityList', {
				page: this.pageIndex,
				psize: 10
			}).then(res => {
				console.log(res);
				this.activityData = res.data.activity;
			});
		},
		setTime(data) {
			//计算时间
			// 判断当前是否在拼团开启时间内
			console.log(data);
			let start = new Date(Number(data[0].start_time) * 1000);
			let end = new Date(Number(data[0].end_time) * 1000);
			let now = new Date();
			if (now >= start && now <= end) {
				console.log('在拼团时间内');
			}
			let time = {};
			let newtime = end - now;
			console.log(newtime);
			// 获取剩余天数
			// time.day = Math.floor(newtime / 1000 / 60 / 60 / 24);
			// var daysRound = Math.floor(time.day);
			// time.hours = Math.floor(newtime / 1000 / 60 / 60 - 24 * daysRound);
			// var hoursRound = Math.floor(time.hours);
			// time.minutes = Math.floor(newtime / 1000 / 60 - 24 * 60 * daysRound - 60 * hoursRound);
			// var minutesRound = Math.floor(time.minutes);
			// time.seconds = Math.floor(newtime / 1000 - 24 * 60 * 60 * daysRound - 60 * 60 * hoursRound - 60 * minutesRound);
			console.log(time);
			this.times = newtime;
		},
		getUserInfo() {
			this.request('user/getUserInfo', {}).then(res => {
				// this.locationId = res.data.goods_point_id;
				if (res.code == 200) {
					this.getdefault(res.data.goods_point_id);
					this.getMasters(res.data.leader_id);
					setUserInfo(res.data);
					this.userInfo = res.data;
				} else if (res.code == 400) {
					removeToken();
				}
			});
		},
		getdefault(id) {
			//获取用户默认的提货点
			this.request('user/getGoodsPointLeaderInfo', {
				type: 1,
				type_id: id
			}).then(res => {
				console.log(res);
				if (res.code == 200) {
					this.location = res.data;
					if (this.location.address && this.location.address !== '') {
						this.city = this.location.address;
					}
				} else {
					this.location = {};
				}
			});
		},
		getMasters(id) {
			this.request('user/getGoodsPointLeaderInfo', {
				type: 2,
				type_id: id
			}).then(res => {
				console.log(res);
				if (res.code == 200) {
					this.master = res.data;
				} else {
					this.master = {};
				}
			});
		},
		jumpPoster() {
			this.$Router.push({
				path: '/pages/goods/createPoster'
			});
		}
	},
	onShareAppMessage: function(ret) {
		//**** 在这里配置弹出的分享框的内容
		console.log(this.userInfo);
		let uid = this.userInfo.user_id || '';
		return {
			title: '社区保障供应', // 设置弹出框的标题
			path: `/pages/tabBar/home/home?pid=${uid}`, //设置弹出框分享出去的链接地址
			imageUrl: '/static/img/shuiguo.jpg', //设置弹出框分享出去的图片
			success: function(res) {
				console.log(res);
			}
		};
	}
};
</script>
<style lang="scss" scoped>
page {
	position: relative;
	background-color: #fff;
}

@font-face {
	font-family: 'HMfont-home';
	src: url('data:application/x-font-woff2;charset=utf-8;base64,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')
		format('woff2');
}

.pullDown-effects {
	position: fixed;
	//top: calc(100upx - 36vw);
	top: 0;
	z-index: 9;
	width: 100%;
	height: 36vw;
	/*  #ifdef  APP-PLUS  */
	padding-top: var(--status-bar-height);
	/*  #endif  */
	image {
		width: 100%;
		height: 36vw;
	}
}
.status {
	width: 100%;
	height: 0;
	position: fixed;
	z-index: 10;
	background-color: #fff;
	top: 0;
	/*  #ifdef  APP-PLUS  */
	height: var(--status-bar-height); //覆盖样式
	/*  #endif  */
}
.header {
	width: 92%;
	// padding: 0 4%;
	height: 100upx;
	display: flex;
	align-items: center;
	position: fixed;
	top: 0;
	z-index: 10;
	/*  #ifdef  APP-PLUS  */
	top: var(--status-bar-height);
	/*  #endif  */
	.nav_title {
		font-size: 32upx;
	}
}
.input-box {
	width: 150upx;
	height: 40upx;
	background-color: #ffffff;
	border-radius: 30upx;
	border: 1px solid rgba(170, 170, 170, 1);
	position: relative;
	display: flex;
	align-items: center;
	.icon {
		display: flex;
		align-items: center;
		position: absolute;
		top: -2upx;
		right: 0;
		width: 40upx;
		height: 40upx;
		font-size: 32upx;
		color: #c0c0c0;
	}
	input {
		padding-left: 28upx;
		height: 28upx;
		font-size: 28upx;
	}
}
.icon-btn {
	width: 120upx;
	height: 60upx;
	flex-shrink: 0;
	display: flex;
	.icon {
		width: 60upx;
		height: 60upx;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		font-size: 42upx;
	}
}
.addr {
	// width: 120upx;
	height: 60upx;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	font-size: 24upx;
	margin-top: 40upx;
	margin-left: 4%;
	position: relative;
	color: #333333;
	.icon {
		height: 60upx;
		margin-right: 5upx;
		display: flex;
		align-items: center;
		font-size: 42upx;
		color: #ffc50a;
	}
	.city_name {
		width: 50vw;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.master {
		position: absolute;
		right: 4%;
		top: 15upx;
		font-size: 24upx;
		color: #333333;
		image {
			width: 45upx;
			height: 45upx;
			border-radius: 50%;
			margin-right: 15upx;
			float: left;
		}
		text {
			line-height: 45upx;
		}
	}
}
.place {
	background-color: #ffffff;
	height: 100upx;
	/*  #ifdef  APP-PLUS  */
	margin-top: var(--status-bar-height);
	/*  #endif  */
}
.swiper {
	width: 100%;
	margin-top: 20upx;
	display: flex;
	justify-content: center;
	.swiper-box {
		width: 100%;
		height: 40.7vw;
		overflow: hidden;
		// border-radius: 15upx;
		box-shadow: 0upx 8upx 25upx rgba(0, 0, 0, 0.2);
		//兼容ios，微信小程序
		position: relative;
		z-index: 1;
		swiper {
			width: 100%;
			height: 40.7vw;
			swiper-item {
				image {
					width: 100%;
					height: 40.7vw;
				}
			}
		}
		.indicator {
			position: absolute;
			bottom: 20upx;
			left: 20upx;
			background-color: rgba(255, 255, 255, 0.4);
			width: 150upx;
			height: 5upx;
			border-radius: 3upx;
			overflow: hidden;
			display: flex;
			.dots {
				width: 0upx;
				background-color: rgba(255, 255, 255, 1);
				transition: all 0.3s ease-out;
				&.on {
					width: (100%/3);
				}
			}
		}
	}
}

.category-list {
	width: 92%;
	margin: 0 4%;
	padding: 0 0 30upx 0;
	border-bottom: solid 2upx #f6f6f6;
	display: flex;
	// justify-content: space-between;
	flex-wrap: wrap;
	.category {
		width: 20%;
		margin-top: 50upx;
		display: flex;
		flex-wrap: wrap;
		.img {
			width: 100%;
			display: flex;
			justify-content: center;
			image {
				width: 9vw;
				height: 9vw;
				display: block;
			}
		}
		.text {
			margin-top: 16upx;
			width: 100%;
			display: flex;
			justify-content: center;
			font-size: 24upx;
			color: #333;
		}
	}
}
.banner {
	width: 92%;
	margin: 20upx 4%;
	image {
		width: 100%;
		height: 27vw;
		// border-radius: 10vw;
		border-radius: 8upx;
		box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.3);
	}
}
.promotion {
	width: 92%;
	margin: 0 4%;
	.text {
		width: 100%;
		height: 60upx;
		font-size: 34upx;
		font-weight: 600;
		margin-top: -10upx;
	}
	.list {
		width: 100%;
		display: flex;
		justify-content: space-between;
		.column {
			width: 43%;
			padding: 15upx 3%;
			background-color: #ebf9f9;
			border-radius: 10upx;
			overflow: hidden;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			.top {
				width: 100%;
				height: 40upx;
				display: flex;
				align-items: center;
				margin-bottom: 5upx;
				.title {
					font-size: 30upx;
				}
				.countdown {
					margin-left: 20upx;
					display: flex;
					height: 40upx;
					display: flex;
					align-items: center;
					font-size: 20upx;
					view {
						height: 30upx;
						background-color: #f06c7a;
						display: flex;
						justify-content: center;
						align-items: center;
						color: #fff;
						border-radius: 4upx;
						margin: 0 4upx;
						padding: 0 2upx;
					}
				}
			}
			.left {
				width: 50%;
				height: 18.86vw;
				display: flex;
				flex-wrap: wrap;
				align-content: space-between;
				.ad {
					margin-top: 5upx;
					width: 100%;
					font-size: 22upx;
					color: #acb0b0;
				}
				.into {
					width: 100%;
					font-size: 24upx;
					color: #aaa;
					margin-bottom: 5upx;
				}
			}
			.right {
				width: 18.86vw;
				height: 18.86vw;
				image {
					width: 18.86vw;
					height: 18.86vw;
				}
			}
		}
	}
}
.goods-list {
	// background-color: #f4f4f4;
	.title {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 80upx;
		color: #f47825;
		font-size: 30upx;
		margin-top: 10upx;
		image {
			width: 30upx;
			height: 30upx;
		}
	}
	.loading-text {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 60upx;
		color: #979797;
		font-size: 24upx;
	}
	.product-list {
		width: 92%;
		padding: 0 4% 3vw 4%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		.product {
			width: 48%;
			border-radius: 20upx;
			background-color: #fff;
			margin: 0 0 15upx 0;
			box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.1);
			image {
				width: 100%;
				border-radius: 20upx 20upx 0 0;
			}
			.name {
				width: 92%;
				padding: 10upx 4%;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				text-align: justify;
				overflow: hidden;
				font-size: 30upx;
			}
			.info {
				display: flex;
				justify-content: space-between;
				align-items: flex-end;
				width: 92%;
				padding: 10upx 4% 10upx 4%;

				.price {
					color: #e65339;
					font-size: 30upx;
					font-weight: 600;
				}
				.slogan {
					color: #807c87;
					font-size: 24upx;
				}
			}
		}
	}
}
.fixed_btn {
	position: fixed;
	right: 0;
	top: 78%;
	width: 130upx;
	background-color: pink;
	height: 70upx;
	line-height: 70upx;
	border-top-left-radius: 40upx;
	border-bottom-left-radius: 40upx;
	z-index: 150;
	image {
		height: 50upx;
		width: 50upx;
		float: left;
		margin: 10upx;
	}
	text {
		color: #ffffff;
		font-size: 24upx;
	}
}
</style>
